<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>环保账号登录</title>
    <link rel="stylesheet" href="./css/swiper.css">
    <link rel="stylesheet" href="./css/public.css">
    <style>
        body {
            background: #F4F4F4;
        }

        .back {
            width: 0.24rem;
            padding: 0.266rem;
        }

        .logo {
            width: 1.6rem;
            display: block;
            margin: 0 auto;
            margin-top: 0.88rem;
        }

        .title {
            font-size: 14px;
            font-family: Adobe Heiti Std R;
            color: rgba(38, 38, 38, 1);
            line-height: 21px;
            text-align: center;
            margin-top: 4px;
        }

        .inputBox {
            width: 6.666rem;
            box-sizing: border-box;
            padding: 0.134rem 0;
            padding-left: 0.586rem;
            font-size: 14px;
            font-family: Adobe Heiti Std R;
            font-weight: normal;
            color: rgba(153, 153, 153, 1);
            line-height: 21px;
            border-bottom: 2px solid rgba(0, 0, 0, 0.2);
            margin: 0 auto;
            margin-top: 0.933rem;
        }

        .inputBox input {
            border: none;
            outline: none;
            background: none;
            /* flex: 1; */
            width: 3.733rem;
        }
        .switch {
            width: 6.666rem;
            margin: 0 auto;
            margin-top: 0.4rem;
            text-align: right;
            font-size:9px;
            font-family:Adobe Heiti Std R;
            font-weight:normal;
            color:rgba(89,89,89,1);
            cursor: pointer;
        }
        .btn {
            width:6.666rem;
            height:1.066rem;
            background:rgba(0,107,255,1);
            border-radius:0.08rem;
            box-sizing: border-box;
            text-align: center;
            line-height: 1.066rem;
            color: #fff;
            font-size:0.4rem;
            margin: 0 auto;
            margin-top: 1.466rem;
            cursor: pointer;
        }
        .yzm {
            width:2.386rem;
            height:0.72rem;
            background:rgba(255,122,0,0.83);
            border-radius:0.08rem;
            text-align: center;
            color: #fff;
            box-sizing: border-box;
            line-height: 0.72rem;
            font-size:12px;
        }
    </style>
    <script src="./js/index.js"></script>

</head>

<body>
    <main>
        <img class="back" src="./img/back_r.png" alt="">
        <img class="logo" src="./img/hbzh_logo.png" alt="">
        <div class="title">一点清</div>
        <div class="flex inputBox">
            <input type="text" placeholder="请输入环保手机号">
            <div class="yzm">获取验证码</div>
        </div>
        <div class="flex inputBox">
            <input type="password" placeholder="请输入环保密码">
        </div>
        <div class="btn">登录</div>
    </main>

    <script src="./js/jquery.js"></script>
    <script src="./js/swiper.js"></script>
    <script src="./js/public.js"></script>
    <script>
        $('.switch').click(function() {
            location.href = './login_hb_p.html';
        })
        $('.back').click(function() {
            history.back(-1);
        })
    </script>
</body>

</html>